<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="core" uri="http://java.sun.com/jsp/jstl/core" %>
<script type="text/javascript">
	$(document).ready(function(){
		$("#searchSelector").change(function(){
			if($(this).val()=="name"){
				$("#searchForm").html("<input type='text' name='auctionName'>");
			} else{
				$.ajax({
					"url":"/${initParam.context_root}/auctionCategoryList.do",
					"type":"post",
					"dataType":"json",
					"success" : function(data){
						var txt = "<select name='category'>";
						for(i=0; i<data.category.length; i++){
							txt += "<option value='" + data.category[i] + "'>" + data.category[i] + "</option>"; 
						}
						txt += "</select>";
						
						$("#searchForm").html(txt);
					},
					"error" : function(){
						alert("요청 처리중 오류가 발생했습니다.");
					}
				});
			}
		});
	$(".listContainer").hover(function(){
		$(this).css("background","#e6e6fa");
	},function(){
		$(this).css("background", "none");
	});
	
	});
	function detail(i){
		$("input[type=hidden]").attr("name", "auctionNo");
		$("input[type=hidden]").val(i);
		$("#detail").submit();
	}
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<form action="/${initParam.context_root }/auctionSearch.do" method="POST">
<input type="hidden" name="page" value="1">
<div style="width: 90%; text-align: right">
<table align="center">
		<tr>
			<td><a href="/${initParam.context_root }/auctionList.do?page=1" style="text-decoration: none"><font color="red" >≪</font></a></td>
			<td>
			<core:choose>
			<core:when test="${requestScope.list.pagingDTO.previousPageGroup}">
			<a href="/${initParam.context_root }/auctionList.do?page=${requestScope.list.pagingDTO.startPageOfPageGroup - 1}" style="text-decoration: none"><font color="red" >＜</font></a>			
			</core:when>
			<core:otherwise>
			<a href="/${initParam.context_root }/auctionList.do?page=1" style="text-decoration: none"><font color="red" >＜</font></a>
			</core:otherwise>
			</core:choose>
			</td>
			<core:forEach begin="${requestScope.list.pagingDTO.startPageOfPageGroup }" end="${requestScope.list.pagingDTO.endPageOfPageGroup }" var="page">
				<td>
				<core:choose>
						<core:when test="${page != requestScope.list.pagingDTO.currentPage }">
							<a href="/${initParam.context_root }/auctionList.do?page=${page}" style="text-decoration: none"><font color="RED">${page}</font></a>
						</core:when>
						<core:otherwise>
			<b><font color="RED" >${page}</font></b>
			</core:otherwise>
			</core:choose></td>
			</core:forEach>
			<td>
			<core:choose>
			<core:when test="${requestScope.list.pagingDTO.nextPageGroup}">
			<a href="/${initParam.context_root }/auctionList.do?page=${requestScope.list.pagingDTO.endPageOfPageGroup + 1}" style="text-decoration: none"><font color="red" >＞</font></a>			
			</core:when>
			<core:otherwise>
			<a href="/${initParam.context_root }/auctionList.do?page=${requestScope.list.pagingDTO.totalPage}" style="text-decoration: none"><font color="red" >＞</font></a>
			</core:otherwise>
			</core:choose>
			</td>
			<td>
			<a href="/${initParam.context_root }/auctionList.do?page=${requestScope.list.pagingDTO.totalPage}" style="text-decoration: none"><font color="red" >≫</font></a>
			</td>
		</tr>
	</table>
	<select id="searchSelector">
	<option value="name">제목</option>
	<option value="category">카테고리</option>
	</select><span id="searchForm"><input type="text" name="auctionName"></span><input type="submit" value="검색"><input type="button" value="중고거래 등록" onclick="location.href='/${initParam.context_root}/registerAuctionForm.do'">
</div>
</form>

<form action="/${initParam.context_root}/auctionDetail.do" method="post" id="detail">
<input type="hidden" value="">
<core:forEach items="${requestScope.list.list}" var="list">
<div align="center" class="listContainer" style="width: 90%; height:200px ; border :medium inset gray; margin: 20px; float: left; padding-top: 20px; padding-bottom: 20px; cursor:pointer;" onclick="detail(${list.auctionNo})">
	<div style="float: left; width: 10%; height : 100%;">
		${list.saleLocation }
	</div>
	<div style="float: left; width: 30%; height : 100%; vertical-align: middle;">
		<img src="/${initParam.context_root }/upfile/${list.file}"  width="100%" height="100%">
	</div>
	<div style="float: left; width: 58%; height : 100%;" align="left">
		<center><b>${list.auctionName }</b><hr noshade="noshade" width="80%">${list.memberDTO.name } | 등록일 : ${list.registerDate }<p>${list.useStartDate } ~ ${list.useEndDate}<br>
		<table align="center" border="1" width="80%" >
			<thead>
			<tr>
				<th>정상가</th>
				<th>할인가</th>
				<th>희망판매가</th>
			</tr>				
			</thead>
			<tbody>
			<tr>
				<td><center><strike><font color="gray">${list.originalPrice }원</font></strike></center></td>
				<td><center><strike><font color="gray">${list.couponPrice }원</font></strike></center></td>
				<td><center>${list.wantPrice }원</center></td>
			</tr>
			</tbody>
		</table>
		</center>
	</div>
</div>
</core:forEach>
</form>
<table align="center">
		<tr>
			<td><a href="/${initParam.context_root }/auctionList.do?page=1" style="text-decoration: none"><font color="red" >≪</font></a></td>
			<td>
			<core:choose>
			<core:when test="${requestScope.list.pagingDTO.previousPageGroup}">
			<a href="/${initParam.context_root }/auctionList.do?page=${requestScope.list.pagingDTO.startPageOfPageGroup - 1}" style="text-decoration: none"><font color="red" >＜</font></a>			
			</core:when>
			<core:otherwise>
			<a href="/${initParam.context_root }/auctionList.do?page=1" style="text-decoration: none"><font color="red" >＜</font></a>
			</core:otherwise>
			</core:choose>
			</td>
			<core:forEach begin="${requestScope.list.pagingDTO.startPageOfPageGroup }" end="${requestScope.list.pagingDTO.endPageOfPageGroup }" var="page">
				<td>
				<core:choose>
						<core:when test="${page != requestScope.list.pagingDTO.currentPage }">
							<a href="/${initParam.context_root }/auctionList.do?page=${page}" style="text-decoration: none"><font color="RED">${page}</font></a>
						</core:when>
						<core:otherwise>
			<b><font color="RED" >${page}</font></b>
			</core:otherwise>
			</core:choose></td>
			</core:forEach>
			<td>
			<core:choose>
			<core:when test="${requestScope.list.pagingDTO.nextPageGroup}">
			<a href="/${initParam.context_root }/auctionList.do?page=${requestScope.list.pagingDTO.endPageOfPageGroup + 1}" style="text-decoration: none"><font color="red" >＞</font></a>			
			</core:when>
			<core:otherwise>
			<a href="/${initParam.context_root }/auctionList.do?page=${requestScope.list.pagingDTO.totalPage}" style="text-decoration: none"><font color="red" >＞</font></a>
			</core:otherwise>
			</core:choose>
			</td>
			<td>
			<a href="/${initParam.context_root }/auctionList.do?page=${requestScope.list.pagingDTO.totalPage}" style="text-decoration: none"><font color="red" >≫</font></a>
			</td>
		</tr>
	</table>